<template>
  <view class="container">
    <view class="top">
      <image src="../../static/image/colorful-fruit-shop.jpg" mode=""></image>
      <view class="">
        <span style="font-weight:bolder;font-size: 20px;">小农甄选</span>
      </view>
    </view>
    <view class="center">
      <h2 style="font-weight: bold;">该程序将获取以下授权：</h2>
      <view class="">
        <span style="color:#A1A1AB;">· 获得您的公开信息（昵称、头像等）</span>
      </view>
    </view>
    <view class="bottom">
      <view class="btn-F" @click="cancel">拒绝</view>
      <button class="btn-T" type="phone" open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber">允许</button>
      <!-- <view class="btn-T" @click='login'>允许</view> -->
    </view>
  </view>
</template>


<!-- <template>
  <view class="body">
    <view class="btn" @click='login'>
      <view class="text">
        微信一键登录
      </view>
    </view>
  </view>
</template> -->

<script>
  import {
    getPhoneNumber,
    getopenid
  } from '../../api/openid/openid.js'
  export default {
    data() {
      return {
        scene: '',
      }
    },
    onLoad(options) {
      this.scene = options.scene,
        // this.scene = "qX33bTvnPmlhnpFCMnEKkss1lDqzpP1v",
        //  console.log("邀请码数据:", this.scene || "无邀请数据...");
        uni.setStorageSync('scene', this.scene);
    },
    methods: { // #ifdef MP-WEIXIN
      decryptPhoneNumber(e) {
        // 获取手机号后的逻辑处理，e.detail.encryptedData 包含加密数据
        // 这里需要将加密数据发送到后端进行解密，获取真实的手机号
        // 然后将手机号存储到本地缓存
        // console.log('加密数据:', e.detail.code);
        getPhoneNumber(e.detail.code).then(res => {
          let phoneNumber = res.data.data.phone_info.phoneNumber; // 这里应该是后端返回的手机号 
          // console.log('手机号', phoneNumber);
          let scene = uni.getStorageSync('scene') || null;
          wx.login({
            success: (res) => {
              if (res.code) {
                // 发送 res.code 到后台换取 openId, sessionKey, unionId
                const code = res.code;
                // console.log(code);
                //  console.log("scene", scene);
                // 这里可以将code发送到你的服务器，服务器使用code获取access_token等信息
                getopenid(code, phoneNumber, scene).then(res => {
                  const userInfo = res.data.data
                  userInfo.nickName = res.data.data.virtualName
                  userInfo.avatarUrl = res.data.data.image
                  uni.setStorageSync("userInfo", userInfo);
                  uni.setStorageSync("openid", res.data.data.openId)
                  let currentRoute = uni.getStorageSync('currentRoute')
                  if (currentRoute && currentRoute == 'pages/newOrder/newOrder') {
                    uni.switchTab({
                      url: '/pages/newOrder/newOrder'
                    });
                  } else if (currentRoute) {
                    // 如果currentRoute为null，执行其他逻辑
                    uni.redirectTo({
                      url: '/' + currentRoute
                    });
                  } else {
                    uni.switchTab({
                      url: '/pages/index/index',
                    });
                  }
                }).catch(error => {
                  console.error('获取 openid 失败', error);
                }); // 处理服务器返回的 openid 等信息
              } else {
                //  console.log('微信登录失败，没有获取到code');
              }
            },
            fail: () => {
              //  console.log('微信登录失败');
            }
          });
        }).catch(error => {
          console.error('获取手机号失败', error);
        });


      },
      cancel() {
        // 如果currentRoute为null，执行其他逻辑
        uni.switchTab({
          url: '/pages/index/index'
        });
      },

      login() {
        uni.getUserProfile({
          desc: "获取用户信息",
          success(res) {
            // console.log("res", res)
            let scene = uni.getStorageSync('scene') || null;
            let user = res.userInfo;
            wx.login({
              success: (res) => {
                if (res.code) {
                  // 发送 res.code 到后台换取 openId, sessionKey, unionId
                  const code = res.code;
                  console.log(code);
                  //  console.log("scene", scene);
                  // 这里可以将code发送到你的服务器，服务器使用code获取access_token等信息
                  getopenid(code, scene).then(res => {
                    user.nickName = res.data.data.virtualName
                    user.avatarUrl = res.data.data.image
                    const userInfo = {
                      ...user,
                      ...res.data.data
                    }
                    uni.setStorageSync("userInfo", userInfo);
                    uni.setStorageSync("openid", res.data.data.openId)


                    let currentRoute = uni.getStorageSync('currentRoute')
                    if (currentRoute && currentRoute == 'pages/newOrder/newOrder') {
                      uni.switchTab({
                        url: '/pages/newOrder/newOrder'
                      });
                    } else if (currentRoute) {
                      // 如果currentRoute为null，执行其他逻辑
                      uni.redirectTo({
                        url: '/' + currentRoute
                      });
                    } else {
                      uni.switchTab({
                        url: '/pages/index/index',
                      });
                    }
                  }).catch(error => {
                    console.error('获取 openid 失败', error);
                  }); // 处理服务器返回的 openid 等信息
                } else {
                  //  console.log('微信登录失败，没有获取到code');
                }
              },
              fail: () => {
                //  console.log('微信登录失败');
              }
            });
          }
        })

      }
      // #endif
    }
  }
</script>

<style scoped>
  button {

    margin: 0;

  }

  .container {
    display: flex;
    flex-direction: column;
    height: 60vh;
    padding: 20px;
    justify-content: space-around;
  }

  .top {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    border-bottom: 0.1px solid #e3e3e3;
    padding: 10px;
    height: 50%;
  }

  image {
    margin-bottom: 20px;
    width: 75px;
    height: 75px;
    border-radius: 10px;
  }

  .center {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    height: 90px;
    padding: 20px;
  }


  .bottom {
    display: flex;
    justify-content: space-around;
    padding: 10px 0px;
    justify-items: center;
  }

  .btn-F {
    font-size: 14px;
    width: 45%;
    background-color: #888888;
    border-radius: 25px;
    height: 50px;
    line-height: 50px;
    color: #fff;
    text-align: center;

  }

  .btn-T {
    height: 50px;
    line-height: 50px;
    width: 45%;
    font-size: 14px;
    text-align: center;
    background-color: #009944;
    border-radius: 25px;
    /* padding: 12px 20%; */
    color: #fff;
  }

  /* 
  .body {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 80vh;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
  }

  .btn {

    display: flex;
    justify-content: center;
    align-items: center;
    background-color: green;
    border-radius: 10px;
    padding: 20px 50px;
    color: #fff;
  }

  .text {
    width: 100px;
  } */
</style>